// 路由的配置：给组件文件绑定路径，以便进行切换
// 分四步：导包导库及组件文件、创建路由数组并绑定地址，创建路由对象，导出路由对象
// (1) 导包导库导组件文件
import System from '../components/system/System.vue';
import Login from '../components/user/Login.vue';
import Register from '../components/user/Register.vue';
import Index from '../components/home/Index.vue';
import Center from '../components/about/Center.vue';
import DeviceDetail from '../components/detail/DeviceDetail.vue';
import { createRouter, createWebHistory } from 'vue-router'; // 路由库

// (2) 创建路由数组，映射地址
const routes = [ // 路由地址中必须有一个根路径/,自动打开,否则报错
    { // 重定向方式设置根路径,此路径默认打开
        path: '/',
        redirect: '/login'
    },
    {
        path: '/system',
        name: 'System',
        component: System,
        meta: { requiresAuth: true } // 需要身份验证的路由
    },
    {
        path: '/center',
        name: 'Center',
        component: Center,
        meta: { requiresAuth: true } // 需要身份验证的路由
    },
    {
        path: '/login', // 可以是根路径/
        name: 'Login',
        component: Login
    },
    {
        path: '/register',
        name: 'Register',
        component: Register
    },
    {
        path: '/index',
        name: 'Index',
        component: Index,
        meta: { requiresAuth: true } // 需要身份验证的路由
    },
    {
        path: '/device/:deviceType/:deviceId',
        name: 'DeviceDetail',
        component: DeviceDetail,
        meta: { requiresAuth: true } // 需要身份验证的路由
    },
]

// (3) 创建路由对象
const router = createRouter({
    // 打补丁
    history: createWebHistory(),
    // 简写为 routes
    routes: routes
})

// (4) 添加路由守卫
router.beforeEach((to, from, next) => {
    const token = localStorage.getItem('token'); // 假设 token 存储在 localStorage 中

    // 如果路由需要身份验证且用户未登录，则重定向到登录页
    if (to.matched.some(record => record.meta.requiresAuth) && !token) {
        next({ path: '/login' }); // 重定向到登录页
    } else if (to.name === 'Login' && token) {
        // 如果当前访问的是登录页且用户已登录，则清空 token 并要求重新登录
        localStorage.removeItem('token'); // 清空 token
		localStorage.removeItem('user_id'); // 清空 token
        next(); // 允许访问登录页
    } else {
        next(); // 确保要调用 next()
    }
});

// (5) 导出路由对象
export default router;
